@charset "utf-8";
/* CSS Document */
body{margin:0; padding:0; font:12px Arial,"microsoft yahei"; color:#333; background:#fff;}
body,h1,h2,h3,h4,h5,h6,hr,p,blockquote,dl,dt,dd,ul,ol,li,pre,form,fieldset,legend,button,input,textarea,th,td{margin:0;padding:0; }
ul,li,ol{list-style:none;}
a{text-decoration:none; color:#333;}
a:hover{text-decoration:none; color:#412525;}
input,textarea,select,button{  font-family:Arial,"Microsoft YaHei";}
input:focus,textarea:focus,select:focus,button:focus{ outline:none;}
::-moz-selection {background:#333;color:#FFF;}
::selection {background: #333;color: #FFF;}
img{border:0}
.clear { zoom: 1;clear:both; }
.clear:after { content: ''; display: block; clear: both; }

@font-face {font-family:'PoiretOne'; src: url('../fonts/PoiretOne.ttf') format('truetype'); }
@font-face {font-family:'verdana'; src: url('../fonts/verdana.ttf') format('truetype'); }
@font-face {font-family:'Agency'; src: url('../fonts/Agency.ttf') format('truetype'); }

.fl{ float:left;}
.fr{ float:right;}

@media screen and (max-width:1600px){


.c1440{ width:75rem; margin:0 auto; min-width:75rem;}
.m1440{ min-width: 75rem;}
    

/* header */
.header{  min-width:75rem;}
.menu li a{ color: #ccc; line-height: 48px;}
.menu li p{ font-size: 48px;  }

/* banner */
.rightIcon .item{ top:20%; }


/* pageBanner */
.pageBanner .Cont{ width: 75rem; margin-left: -37.5rem; }
.pageBanner .Cont .more a{ margin-top: 40px; }
.pageBanner .ContD{ width: 75rem; margin-left: -37.5rem; }
.pageBanner .ContMD{ width: 75rem; margin-left: -37.5rem; }
.pageBanner .ContAbout{ width: 75rem; margin-left: -37.5rem; }



/* indexBanner */
#indexBanner{position: relative; overflow: hidden; height:100vh; min-width:75rem; background-color: #21282e;}
/* banner */
.banner{height:100%; position:relative; min-width:75rem;}

.banner1_2{position:absolute;z-index:9;left:10%; top: 70%; width: 15px; height: 20px; background: url(../images/banner/shubiao.png) center center no-repeat;}



/* pageNav */
.pageNav ul{  width: 75rem; }

/* pageCase */
.pageCase{  width: 75rem; }

/* caseTop */
.caseTop{ margin: -10rem 0 5rem -34.375rem; }

/* caseContent */
.caseContent{ width: 75rem; }

/* caseDetails */
.caseDetails{ width:75rem; }

/* pageNews */
.pageNews{  width: 75rem; }

/* NewsD */
.NewsDTop .Cont .title{ width: 75rem; }
.NewsDTop .Cont .slogan .cont{width: 75rem; }


.pageNewsD .NewsDC{  width: 75rem;  }

.relatedNews{  width: 75rem; }


/* about01 */
.about01{ width: 75rem; }
.about01 .cont{ width: 40.625rem;}
.about01 .img{ width: 31.25rem; height: 18.75rem;}
.about01 .img img{ width: 31.25rem;; height: 18.75rem;}
.about01 .list dl{ display: inline-block; width: 19.77%;}

/* about02 */
.about02 .cont .line{  height: 27.5rem; display: none;}
.about02 .cont .con{ width: 75rem; }
.about02 .cont .con .list{  padding: 1.875rem; }

/* about03 */
.about03{ width: 75rem;  }
.about03 dl{  width: 23.125rem; margin-left: 2.8125rem; }
.about03 dl:hover .title{ transform: translateY(2rem); }
.about03 dl:hover .line{ transform: translateY(3.25rem); }
.about03 dl:hover .cont{ transform: translateY(4.5rem); }

/* about04 */
.about04{ height: 70rem;}
.about04 .List{ width: 75rem; height: 63.75rem; }
.about04 .List .img1{ width: 19.375rem; height: 30.9375rem;}
.about04 .List .img2{ width: 19.375rem; height: 27.8125rem;}
.about04 .List .img3{ width: 23.75rem; left: 19.375rem;  height: 25.625rem;}
.about04 .List .img4{ width: 23.75rem; top: 36.875rem; left: 19.375rem;  height: 29.0625rem;}
.about04 .List .img5{ width: 31.875rem; top: 38.4375rem; height: 18.75rem;}
.about04 .List .cont{ position: absolute; top: 5rem; right: 0; height: 27.1875rem; background-color: #fff; padding: 3.125rem; width: 25.625rem;}
.about04 .List .cont .title{ float: left; width: 100%; font-size: 2.875rem; color: #000; margin-bottom: 1.25rem;}
.about04 .List .cont .con{ font-size: 1rem; float: left; width: 100%; color: #999; line-height: 1.75rem;}
.about04 .List .cont .con p{ margin-top: 1.25rem;}
.about04 .List .cont .line{ width: 0.3125rem; height: 4.0625rem; background-color: #ff4229; position: absolute; right: 2.5rem; bottom: 5.3125rem;}
.about04 .List .suncher{position: absolute; top: 57.1875rem; right: 0;  width: 26.875rem;font-family:'verdana'; line-height: 7.8125rem; font-size: 3.5rem; height:7.8125rem; padding: 0 2.5rem; text-transform: uppercase; color: #e8e8e8; font-weight: bold;}

/* about05 */
.about05List{ width: 70rem ;  padding: 3.75rem 2.5rem; }
.about05List .bd ul li{ margin-right:1.25rem; width: 16.5625rem; float:left; _display:inline; overflow:hidden; text-align:center; }

/* pageContact */
.pageContact .list{ width: 75rem; }

/* pageMap */
.pageMap{  min-width: 75rem;}
.pageMap .list{ width: 75rem; margin-left: -600px;}
.pageMap .list dl{ width: 27%; padding: 20px 3%;}


/* pagePartner */
.pagePartner{ width: 75rem; }

/* Website */
.Website .cont{ width: 75rem;}
.Website .cont .left{ width: 720px; padding-left: 60px;}
.Website .cont .left .item p{  width: 180px;}
.Website .cont .right{ width: 380px; height: 310px; margin-right: 0;}
.Website .list{ width: 75rem;}


/* WebExperience */
.WebExperience{ width: 75rem;  }


/* WebAdvantage */
.WebAdvantage .list{ width: 75rem; margin: 50px auto 0;}
.WebAdvantage .list dl{ float: left; width: 208px;  margin-left: 40px;}

/* WebProcess */
.WebProcess .right{ margin: 60px 0 0 0; width: 800px; height: 560px; }
.WebProcess .right1{ margin: 60px 0 0 0; width: 800px; height: 560px; }

/* RelatedCase */
.RelatedCase .title{width: 75rem;}
.RelatedCase .list{width: 75rem;}

/* pageSolution */
.pageSolution .title{width: 75rem; }
.pageSolution .list1{ width: 75rem; }
.pageSolution .list2{ width: 75rem; }
.pageSolution .list1 dl,.pageSolution .list2 dl{ float: left; width: 240px; color: #fff; text-align: center;}
.pageSolution .mid .line-v{ width: 75rem; }
.pageSolution .mid .line-v p{ float: left; width: 1px; margin:0 119px 0 120px; height: 35px; background-color: #3c3c3c;}

/* pageAdvantage */
.pageAdvantage .list{ width: 75rem; margin: 0 auto;}

/* MobileProspect */
.MobileProspect{ width: 75rem; }
.MobileProspect .left{ width: 540px; }
.MobileProspect .left .name{ width: 500px;}
.MobileProspect .left .img{ width: 500px; }
.MobileProspect .left .cont{ width: 500px;}
.MobileProspect .right{ width: 550px;}

/* MobileWhy */
.MobileWhy .left{ width: 550px; margin-left: 0;}
.MobileWhy .right{ margin-right: 0; padding-right: 50px; height: 470px; width: 600px;}
.MobileWhy .right .list{ position: absolute; right: 288px; top:70px; }

/* MobileAdvantage */
.MobileAdvantage{ width: 75rem; margin: 80px auto; padding: 0; position: relative;}

/* MobileCase */
.MobileCase .list{ width: 75rem; margin:70px auto 0;}
.MobileCase .list dl{ float: left; margin: 0 25px; width: 250px; height: 475px; background-size: 100% 100%; overflow: hidden;}
.MobileCase .list dl dd{ width: 220px; height:370px; margin: 55px 16px 50px 14px; }
.MobileCase .list dl img.img1{ width: 220px; height: 370px; }
.MobileCase .list dl p{ width: 180px; height: 180px; padding:40px 40px 0;  transform: translateY(275px); }
.MobileCase .list dl p img{ width: 140px; height: 140px;}


/* Applets */
.Applets .top .left{ margin-left: 50px; width: 530px; height: 410px; }
.Applets .top .right{ width: 400px; margin-right: 100px;}


/* AppChannel */
.AppChannel .list{ width: 75rem; margin:50px auto 0;}
.AppChannel .list dl{ float: left; width: 360px; height: 505px; margin-left: 60px; }
.AppChannel .list dl:first-child{ margin-left: 0;}
.AppChannel .list dl dt{height: 220px; }

/* AppAdvantage */
.AppAdvantage .list{ width: 75rem; }

/* AppScenes */
.AppScenes .list{ width: 75rem; }

/* AppProcess */
.AppProcess .list{ width: 75rem; }
.AppProcess .list p{ width: 42px; }

/* AppCase */
.AppCase .list{ width: 75rem; }
.AppCase .list dl{ float: left; margin-left: 30px; overflow: hidden; width: 380px;}
.AppCase .list dl dd{ width: 280px; height: 120px; overflow: hidden; background-color: #fff; text-align: center; padding: 20px 50px;}


/* MarketingPlanning */
.MarketingPlanning{ width: 75rem; }
.MarketingPlanning .list dl{  padding: 40px 20px; width: 300px; margin: 0 30px; height: 230px; }


/* MarketingWhy */
.MarketingWhy .cont{ width: 75rem; margin: 60px auto 0;}
.MarketingWhy .cont .left{ width: 470px; margin-left: 0;}
.MarketingWhy .cont .right{ width: 640px; height: 510px;  margin-right: 0;}


/* MarketingProblem */
.MarketingProblem{ width: 75rem; }
.MarketingProblem .list dl{ float: left; width: 378px; padding: 45px 0; text-align: center; border: solid 1px #eee;  height: 218px; margin-left: 30px; border-radius: 5px; overflow: hidden;}


/* MarketingProvide */
.MarketingProvide .cont{ width: 72.5rem; margin:50px auto; background-color: #fff; height: 370px; padding: 40px;}
.MarketingProvide .cont .img{ width: 600px; height: 370px; overflow: hidden;}
.MarketingProvide .cont .img img{ width: 100%;}
.MarketingProvide .cont .info{ width: 520px;}
.MarketingProvide .cont .info dl{ float: left; width: 100%; margin: 30px 0;}
.MarketingProvide .cont .info dl dt{ float: left; width: 50px; font-size: 36px; padding-bottom: 10px; color: #ff4229; font-family: 'Agency'; text-align: center ; background: url(../images/marketing/016.png) right bottom no-repeat;  font-style:oblique;}
.MarketingProvide .cont .info dl dd{ float: left; width: 450px; font-size: 14px; margin-left: 20px; color: #999; line-height: 24px;}
.MarketingProvide .cont .info dl dd p{ font-size: 20px; color: #333; margin-bottom: 10px;}


/* pageBrand */
.pageBrand{ width: 75rem; }


/* pageProblem */
.pageProblem .title{width: 75rem; }
.pageProblem .list{ width: 72.5rem; height: 364px; margin:60px auto 0; padding: 20px; background-color: #fff;}
.pageProblem .list li{ float: left; position: relative; width: 290px; height: 364px;}
.pageProblem .list li .img{position: absolute; width: 290px; height: 182px; overflow: hidden;}
.pageProblem .list li img{ width: 290px; height: 182px; transition: all 0.8s ease;}
.pageProblem .list li .cont{position: absolute; text-align: center; width: 250px; padding:21px 20px; height: 140px; font-size: 14px; color: #999; line-height: 24px;}
.pageProblem .list li .cont p{ font-size: 16px; color: #333; font-weight: bold; margin-bottom: 20px;}
.pageProblem .list li:nth-child(odd) .cont{ top: 182px; left: 0;}
.pageProblem .list li:nth-child(even) .img{ top: 182px; left: 0;}


/* pageWork */
.pageWork .title{width: 75rem; }
.pageWork .list{ width: 75rem; }
.pageWork .list .right dl dd{  width: 80%; }



/* VrService */
.VrService{ width: 75rem;  }

/* VrSelect */
.VrSelect .list{ width: 75rem; }

/* VrScenes */
.VrScenes .list{ width: 75rem; }

/* VrCase */
.VrCase .list{ width: 75rem; }

/* VrProcess */
.VrProcess .list{ width: 75rem; margin: 60px auto 0;}
.VrProcess .list dl{ float: left; width: 180px; position: relative; margin-left: 24px; margin-right: 0; height: 180px; overflow: hidden; }
.VrProcess .list dl:first-child{ margin-left: 0;}

}